// component/slideModel/slideModel.js
let animationShowHeight = 300; 
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    showpModalStatus: {
      type: Boolean,
      observer(newVal) {
        // console.log(newVal)
        this.showModal()
      }
    }
  },

  /**
   * 组件的初始数据
   */
  data: {
    animationData: {},

    showModalStatus: false,
    imageHeight: 0,
    imageWidth: 0  
  },
  created() {
    this.onShow()
  },
  /**
   * 组件的方法列表
   */
  methods: {
    showModal: function () {
      // 显示遮罩层  
      var animation = wx.createAnimation({
        duration: 200,
        timingFunction: "linear",
        delay: 0
      })
      this.animation = animation
      animation.translateY(animationShowHeight).step()
      this.setData({
        animationData: animation.export(),
        showModalStatus: true
      })
      setTimeout(function () {
        animation.translateY(0).step()
        this.setData({
          animationData: animation.export()
        })
      }.bind(this), 0)
    },
    //点击取消
    hideModal: function () {
      console.log(this.properties.showModalStatus)
      // 隐藏遮罩层  
      // var animation = wx.createAnimation({
      //   duration: 200,
      //   timingFunction: "linear",
      //   delay: 0
      // })
      // this.animation = animation;
      this.animation.translateY(animationShowHeight).step()
      this.setData({
        animationData: this.animation.export(),
      })
      setTimeout(function () {
        this.animation.translateY(0).step()
        this.setData({
          animationData: this.animation.export(),
          showModalStatus: false
        })
      }.bind(this), 200)
      this.triggerEvent('showpModalStatus', this.properties.showpModalStatus)
    },
    onShow: function () {
      let that = this;
      wx.getSystemInfo({
        success: function (res) {
          animationShowHeight = res.windowHeight;
        }
      })
    }
  }
})
